<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script type="text/javascript">
            google.load("visualization", "1", {packages: ["corechart"]});

            var titleString = 'Eror: cannot connect to database';
            var status;
            var formatter
            var chart;
            var defaultChart = 0;
            var data = [];

            var options;

            var graph = 0;
            var count = 0;
            // google.setOnLoadCallback(drawChart);
            function drawChart() {


                data[100] = google.visualization.arrayToDataTable([
                    ['Type', 'Length'],
                    ['', 0], ['AC', 0], ['CI', 0], ['DI', 0], ['GI', 0], ['HDPE', 0], ['PB', 0], ['PC', 0], ['PE', 0], ['PVC', 0], ['SCP', 0], ['ST', 0], ['TT', 0]
                ]);

                formatter = new google.visualization.NumberFormat({fractionDigits: 0, prefix: 'ความยาว ', suffix: ' เมตร'});
                formatter.format(data[count], 1); // Apply formatter to second column

                //modify graph option
                options = {
                    title: '' + titleString,
                    //title: 'ชนิดท่อประธานและความยาวรวมของท่อประธานจำแนกตามประเภทของท่อ',
                    animation: {duration: 1000, easing: 'out'},
                    vAxis: {title: 'ชนิดท่อประทาน', titleTextStyle: {color: 'red'}},
                    hAxis: {title: "ความยาว (เมตร)"},
                    is3D: true,
                };


                //default BarChart at initial value
                if (defaultChart == 0) {
                    chart = new google.visualization.BarChart(document.getElementById('chart_div'));
                    defaultChart = 1;
                }

                //draw a chart
                chart.draw(data[100], options);
                chart.draw(data[count], options);

            }

            //check variable from dropdown list after that compare and set value in each branch for drawing a graph
            function checkBrach() {

                if (status == 'Branch00') {
                    count = 100;
                    titleString = 'กราฟยังไม่มีข้อมูล';

                    data[100] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 0], ['AC', 0], ['CI', 0], ['DI', 0], ['GI', 0], ['HDPE', 0], ['PB', 0], ['PC', 0], ['PE', 0], ['PVC', 0], ['SCP', 0], ['ST', 0], ['TT', 0]
                    ]);
                }
                else if (status == 'total') {
                    count = 0;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธานรวมทั้งหมด จำแนกตามประเภทของท่อ';

                    data[0] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 841], ['AC', 3963740], ['CI', 15386], ['DI', 261], ['GI', 322312], ['HDPE', 63395], ['PB', 1433819], ['PC', 201], ['PE', 702], ['PVC', 23677920], ['SCP', 18], ['ST', 389806], ['TT', 1502]]);
                }
                else if (status == 'Branch01') {
                    count = 1;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 01 สำนักงานประปาสาขาบางกอกน้อย';

                    data[1] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 69], ['AC', 239652], ['CI', 1091], ['DI', 8], ['GI', 33434], ['HDPE', 2872], ['PB', 60994], ['PE', 281], ['PVC', 1166914], ['ST', 26881]]);
                }
                else if (status == 'Branch02') {
                    count = 2;
                    titleString = 'ชนิดท่อประธานและความยาวรวมท่อประธาน สาขา 02 สำนักงานประปาสาขาตากสิน';
                    data[2] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 258378], ['CI', 2559], ['DI', 9], ['GI', 6157], ['HDPE', 3236], ['PB', 40363], ['PC', 15], ['PE', 39], ['PVC', 1197548], ['SCP', 11], ['ST', 34081]]);
                }
                else if (status == 'Branch03') {
                    count = 3;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 03 สำนักงานประปาสาขาพญาไท';
                    data[3] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 98], ['AC', 253635], ['CI', 141], ['GI', 7397], ['HDPE', 49], ['PB', 56083], ['PVC', 915173], ['ST', 9022], ['TT', 3]]);
                }
                else if (status == 'Branch04') {
                    count = 4;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 04 สำนักงานประปาสาขานนทบุรี';
                    data[4] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 37], ['AC', 150727], ['GI', 6283], ['HDPE', 4462], ['PB', 60993], ['PE', 48], ['PVC', 1434385], ['SCP', 7], ['ST', 17519], ['TT', 243]]);
                }
                else if (status == 'Branch05') {
                    count = 5;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 05 สำนักงานประปาสาขาทุ่งมหาเมฆ';
                    data[5] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 63591], ['CI', 1397], ['GI', 3785], ['HDPE', 384], ['PB', 41361], ['PVC', 585656], ['ST', 8730]]);
                }
                else if (status == 'Branch06') {
                    count = 6;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 06 สำนักงานประปาสาขาแม้นศรี';
                    data[6] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 38], ['AC', 128609], ['CI', 7837], ['GI', 8873], ['HDPE', 400], ['PB', 21443], ['PE', 58], ['PVC', 555624], ['ST', 8317]]);
                }
                else if (status == 'Branch07') {
                    count = 7;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 07 สำนักงานประปาสาขาสุขุมวิท';
                    data[7] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 290276], ['CI', 794], ['GI', 73237], ['HDPE', 2448], ['PB', 138002], ['PC', 11], ['PE', 17], ['PVC', 1326457], ['ST', 18379]]);
                }
                else if (status == 'Branch11') {
                    count = 11;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 01 สำนักงานประปาสาขาภาษีเจริญ';

                    data[11] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 351061], ['CI', 763], ['GI', 9771], ['HDPE', 3194], ['PB', 64462], ['PVC', 1601325], ['ST', 38565], ['TT', 475]]);
                }
                else if (status == 'Branch12') {
                    count = 12;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 12 สำนักงานประปาสาขาลาดพร้าว';
                    data[12] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 183952], ['CI', 5], ['DI', 15], ['GI', 14202], ['HDPE', 60], ['PB', 57082], ['PVC', 1991683], ['ST', 15859]]);
                }
                else if (status == 'Branch13') {
                    count = 13;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 13 สำนักงานประปาสาขาพระโขนง';
                    data[13] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 72], ['AC', 239480], ['DI', 205], ['GI', 26264], ['HDPE', 22186], ['PB', 65228], ['PC', 122], ['PVC', 1882233], ['ST', 26678]]);
                }
                else if (status == 'Branch14') {
                    count = 14;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 14 สำนักงานประปาสาขาสุขสวัสดิ์';
                    data[14] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 113], ['AC', 221078], ['CI', 37], ['GI', 7025], ['HDPE', 5872], ['PB', 25726], ['PE', 154], ['PVC', 1104113], ['ST', 27227]]);
                }
                else if (status == 'Branch15') {
                    count = 15;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 15 สำนักงานประปาสาขาประชาชื่น';
                    data[15] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 85443], ['CI', 620], ['DI', 7], ['GI', 12568], ['HDPE', 2257], ['PB', 68173], ['PC', 53], ['PE', 31], ['PVC', 1109455], ['ST', 12523], ['TT', 285]]);
                }
                else if (status == 'Branch16') {
                    count = 16;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 16 สำนักงานประปาสาขาบางเขน';
                    data[16] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 82], ['AC', 196670], ['GI', 5923], ['HDPE', 566], ['PB', 63921], ['PVC', 1468688], ['ST', 12133]]);
                }
                else if (status == 'Branch17') {
                    count = 17;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 17 สำนักงานประปาสาขาสมุทรปราการ';
                    data[17] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 162942], ['CI', 41], ['GI', 41211], ['HDPE', 2911], ['PB', 129463], ['PE', 54], ['PVC', 1903209], ['ST', 33876]]);
                }
                else if (status == 'Branch53') {
                    count = 53;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 53 สำนักงานประปาสาขามีนบุรี';
                    data[53] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 405040], ['DI', 9], ['GI', 4512], ['HDPE', 215], ['PB', 103626], ['PE', 20], ['PVC', 1776748], ['ST', 24886], ['TT', 312]]);
                }
                else if (status == 'Branch54') {
                    count = 54;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 54 สำนักงานประปาสาขาบางบัวทอง';
                    data[54] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 459572], ['CI', 101], ['GI', 38744], ['HDPE', 1139], ['PB', 390406], ['PVC', 2674894], ['ST', 46539]]);
                }
                else if (status == 'Branch55') {
                    count = 55;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน สาขา 55 สำนักงานประปาสาขาสุวรรณภูมิ';
                    data[55] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 332], ['AC', 273634], ['DI', 8], ['GI', 22926], ['HDPE', 11144], ['PB', 46493], ['PVC', 983815], ['ST', 28591], ['TT', 184]]);
                }
                drawChart();
            }

            /*-------check variable from dropdown list after that compare and set value in each zone for drawing a graph -----*/
            function checkZone() {

                if (status == 'zone00') {
                    count = 100;
                    titleString = 'กราฟยังไม่มีข้อมูล';

                    data[100] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 0], ['AC', 0], ['CI', 0], ['DI', 0], ['GI', 0], ['HDPE', 0], ['PB', 0], ['PC', 0], ['PE', 0], ['PVC', 0], ['SCP', 0], ['ST', 0], ['TT', 0]
                    ]);
                }
                else if (status == 'total') {
                    count = 0;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธานรวมทั้งหมด จำแนกตามประเภทของท่อ';

                    data[0] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 841], ['AC', 3963740], ['CI', 15386], ['DI', 261], ['GI', 322312], ['HDPE', 63395], ['PB', 1433819], ['PC', 201], ['PE', 702], ['PVC', 23677920], ['SCP', 18], ['ST', 389806], ['TT', 1502]]);
                }
                else if (status == 'zone01') {
                    count = 1;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 01';

                    data[1] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 379], ['AC', 452691], ['CI', 4451], ['GI', 40527], ['HDPE', 1001], ['PB', 224455], ['PVC', 2559027], ['ST', 35235], ['TT', 46]]);
                }
                else if (status == 'zone02') {
                    count = 2;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 02';

                    data[2] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 72], ['AC', 341871], ['CI', 1955], ['GI', 28371], ['HDPE', 801], ['PB', 178113], ['PE', 20], ['PVC', 2165911], ['ST', 24917], ['TT', 73]]);
                }
                else if (status == 'zone03') {
                    count = 3;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 03';

                    data[3] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 89], ['AC', 475431], ['CI', 1614], ['DI', 209], ['GI', 41845], ['HDPE', 1986], ['PB', 177335], ['PC', 26], ['PE', 29], ['PVC', 2744231], ['ST', 42321], ['TT', 326]]);
                }
                else if (status == 'zone04') {
                    count = 4;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 04';

                    data[4] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 408072], ['CI', 2332], ['GI', 26628], ['HDPE', 3670], ['PB', 166946], ['PC', 122], ['PE', 298], ['PVC', 2536520], ['ST', 34686], ['TT', 65]]);
                }
                else if (status == 'zone05') {
                    count = 5;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 05';

                    data[5] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 501853], ['CI', 2210], ['DI', 15], ['GI', 49146], ['HDPE', 5339], ['PB', 120765], ['PE', 80], ['PVC', 2987418], ['SCP', 7], ['ST', 51278], ['TT', 63]]);
                }
                else if (status == 'zone06') {
                    count = 6;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 06';

                    data[6] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 130], ['AC', 557616], ['CI', 735], ['DI', 13], ['GI', 56694], ['HDPE', 12732], ['PB', 187444], ['PE', 162], ['PVC', 3267035], ['ST', 52263], ['TT', 315]]);
                }
                else if (status == 'zone07') {
                    count = 7;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 07';

                    data[7] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 151], ['AC', 367716], ['CI', 282], ['DI', 15], ['GI', 36849], ['HDPE', 22212], ['PB', 172425], ['PVC', 2742356], ['ST', 41054], ['TT', 309]]);
                }
                else if (status == 'zone08') {
                    count = 8;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 08';

                    data[8] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 304152], ['CI', 101], ['GI', 20702], ['HDPE', 853], ['PB', 101695], ['PC', 53], ['PE', 39], ['PVC', 1846012], ['ST', 38132], ['TT', 262]]);
                }
                else if (status == 'zone09') {
                    count = 9;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 09';

                    data[9] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 151837], ['GI', 5535], ['HDPE', 4028], ['PB', 44409], ['PVC', 955787], ['ST', 18873], ['TT', 29]]);
                }
                else if (status == 'zone10') {
                    count = 10;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 10';

                    data[10] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 106996], ['CI', 25], ['GI', 10170], ['HDPE', 1463], ['PB', 28552], ['PVC', 516449], ['ST', 11458], ['TT', 14]]);
                }
                else if (status == 'zone11') {
                    count = 11;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 11';

                    data[11] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 20], ['AC', 68285], ['CI', 9], ['GI', 1913], ['HDPE', 5840], ['PB', 8282], ['PE', 74], ['PVC', 355833], ['ST', 12291]]);
                }
                else if (status == 'zone12') {
                    count = 12;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 12';

                    data[12] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 21617], ['GI', 1485], ['PB', 3450], ['PVC', 100116], ['ST', 3847]]);
                }
                else if (status == 'zone13') {
                    count = 13;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 13';

                    data[13] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 22603], ['GI', 462], ['PB', 2309], ['PVC', 114421], ['ST', 3140]]);
                }
                else if (status == 'zone14') {
                    count = 14;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 14';

                    data[14] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 65998], ['DI', 9], ['GI', 501], ['HDPE', 2953], ['PB', 5252], ['PVC', 340642], ['SCP', 11], ['ST', 11149]]);
                }
                else if (status == 'zone15') {
                    count = 15;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 15';

                    data[15] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 12045], ['CI', 220], ['GI', 175], ['HDPE', 14], ['PB', 1734], ['PVC', 38337], ['ST', 674]]);
                }
                else if (status == 'zone16') {
                    count = 16;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 16';

                    data[16] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 33065], ['CI', 1452], ['GI', 143], ['HDPE', 124], ['PB', 4579], ['PVC', 70102], ['ST', 1386]]);
                }
                else if (status == 'zone17') {
                    count = 17;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 17';

                    data[17] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 29803], ['GI', 443], ['PB', 1361], ['PVC', 135577], ['ST', 2444]]);
                }
                else if (status == 'zone18') {
                    count = 18;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน Zone 18';

                    data[18] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 42089], ['GI', 723], ['HDPE', 379], ['PB', 4713], ['PVC', 202146], ['ST', 4658]]);
                }

                drawChart();
            }

            /*-------check variable from dropdown list after that compare and set value in each DMA for drawing a graph ----*/
            function checkDMA() {

                if (status == 'DMA00') {
                    count = 100;
                    titleString = 'กราฟยังไม่มีข้อมูล';

                    data[100] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 0], ['AC', 0], ['CI', 0], ['DI', 0], ['GI', 0], ['HDPE', 0], ['PB', 0], ['PC', 0], ['PE', 0], ['PVC', 0], ['SCP', 0], ['ST', 0], ['TT', 0]
                    ]);
                }
                else if (status == 'total') {
                    count = 0;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธานรวมทั้งหมด จำแนกตามประเภทของท่อ';

                    data[0] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 841], ['AC', 3963740], ['CI', 15386], ['DI', 261], ['GI', 322312], ['HDPE', 63395], ['PB', 1433819], ['PC', 201], ['PE', 702], ['PVC', 23677920], ['SCP', 18], ['ST', 389806], ['TT', 1502]]);
                }
                else if (status == 'DMA01') {
                    count = 1;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 01';

                    data[1] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 578695], ['CI', 2878], ['DI', 156], ['GI', 38596], ['HDPE', 3056], ['PB', 216826], ['PE', 67], ['PVC', 3687661], ['ST', 62555], ['TT', 126]]);
                }
                else if (status == 'DMA02') {
                    count = 2;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 02';

                    data[2] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 510], ['AC', 587926], ['CI', 750], ['DI', 49], ['GI', 49838], ['HDPE', 3526], ['PB', 245163], ['PE', 102], ['PVC', 3503273], ['ST', 58628], ['TT', 201]]);
                }
                else if (status == 'DMA03') {
                    count = 3;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 03';

                    data[3] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 131], ['AC', 565360], ['CI', 2391], ['DI', 7], ['GI', 40330], ['HDPE', 2216], ['PB', 200306], ['PC', 190], ['PE', 29], ['PVC', 3411233], ['ST', 55804], ['TT', 315]]);
                }
                else if (status == 'DMA04') {
                    count = 4;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 04';

                    data[4] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 101], ['AC', 535266], ['CI', 2476], ['DI', 17], ['GI', 34040], ['HDPE', 14187], ['PB', 185322], ['PE', 268], ['PVC', 3366322], ['ST', 51231], ['TT', 253]]);
                }
                else if (status == 'DMA05') {
                    count = 5;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 05';

                    data[5] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 20], ['AC', 438055], ['CI', 1977], ['GI', 37164], ['HDPE', 9736], ['PB', 110187], ['PE', 171], ['PVC', 2536109], ['ST', 38235], ['TT', 329]]);
                }
                else if (status == 'DMA06') {
                    count = 6;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 06';

                    data[6] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 356599], ['CI', 2886], ['GI', 35262], ['HDPE', 5940], ['PB', 128713], ['PVC', 1970915], ['SCP', 7], ['ST', 36976], ['TT', 42]]);
                }
                else if (status == 'DMA07') {
                    count = 7;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 07';

                    data[7] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 274502], ['CI', 854], ['DI', 23], ['GI', 20229], ['HDPE', 14908], ['PB', 112256], ['PVC', 1615797], ['ST', 25381], ['TT', 38]]);
                }
                else if (status == 'DMA08') {
                    count = 8;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 08';

                    data[8] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 9], ['AC', 167481], ['CI', 182], ['GI', 12152], ['HDPE', 524], ['PB', 76061], ['PVC', 1049397], ['ST', 16628], ['TT', 14]]);
                }
                else if (status == 'DMA09') {
                    count = 9;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 09';

                    data[9] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['', 70], ['AC', 167264], ['CI', 401], ['DI', 9], ['GI', 11892], ['HDPE', 3257], ['PB', 52950], ['PVC', 998602], ['SCP', 11], ['ST', 15940], ['TT', 25]]);
                }
                else if (status == 'DMA10') {
                    count = 10;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 10';

                    data[10] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 94243], ['CI', 390], ['GI', 10629], ['HDPE', 536], ['PB', 50137], ['PVC', 602380], ['ST', 12948], ['TT', 15]]);
                }
                else if (status == 'DMA11') {
                    count = 11;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 11';

                    data[11] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 55806], ['CI', 178], ['GI', 9457], ['HDPE', 605], ['PB', 19922], ['PVC', 358140], ['ST', 4823], ['TT', 10]]);
                }
                else if (status == 'DMA12') {
                    count = 12;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 12';

                    data[12] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 42480], ['CI', 23], ['GI', 15082], ['HDPE', 403], ['PB', 12817], ['PVC', 206466], ['ST', 3451], ['TT', 134]]);
                }
                else if (status == 'DMA13') {
                    count = 13;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 13';

                    data[13] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 31816], ['GI', 1548], ['HDPE', 579], ['PB', 9362], ['PC', 11], ['PE', 48], ['PVC', 161034], ['ST', 2124]]);
                }
                else if (status == 'DMA14') {
                    count = 14;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 14';

                    data[14] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 22960], ['GI', 3016], ['HDPE', 2210], ['PB', 2144], ['PVC', 52724], ['ST', 2210]]);
                }
                else if (status == 'DMA15') {
                    count = 15;
                    titleString = 'ชนิดท่อประธานและความยาวรวมของท่อประธาน DMA 15';

                    data[15] = google.visualization.arrayToDataTable([
                        ['Type', 'Length'],
                        ['AC', 23716], ['GI', 597], ['PB', 2699], ['PVC', 87261], ['ST', 1677]]);
                }

                drawChart();
            }

            function test1() {
                alert('Test1 อิอิ');
            }
            /*---------------------------------change graph by checking graph value -------------------------------------*/
            function changeGraph() {

                if (graph == 0) {
                    chart = new google.visualization.PieChart(document.getElementById('chart_div'));
                }
                else {
                    chart = new google.visualization.BarChart(document.getElementById('chart_div'));
                }
                graph = 1 - graph;
                drawChart();
            }


            //dropdown list changed event
            $(document).ready(function() {
                $('select.Branch').change(function() {	//Branch dropdown list
                    var tmp = "";
                    tmp = $("select.Branch option:selected").val();
                    status = tmp;
                    console.log(status);
                    checkBrach();

                });
                $('select.Zone').change(function() {//Zone dropdown list
                    var tmp = "";
                    tmp = $("select.Zone option:selected").val();
                    status = tmp;
                    console.log(status);
                    checkZone();
                });
                $('select.DMA').change(function() {	//DMA dropdown list
                    var tmp = "";
                    tmp = $("select.DMA option:selected").val();
                    status = tmp;
                    console.log(status);
                    checkDMA();
                });

            });




        </script>
    </head>
    <body>

        <form>

            <input type="button" value="เปลี่ยนกราฟ" onclick="changeGraph()" />  
            <br>

            <form>

                <p style="font:Arial; font-size:small; letter-spacing 10px;">Branch &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Zone &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; DMA</p>

                <select class="Branch">
                    <option value="Branch00">Select Branch</option>
                    <option value="total">Total</option>	
                    <option value="Branch01">Branch 01</option>
                    <option value="Branch02">Branch 02</option>
                    <option value="Branch03">Branch 03</option>
                    <option value="Branch04">Branch 04</option>
                    <option value="Branch05">Branch 05</option>
                    <option value="Branch06">Branch 06</option>
                    <option value="Branch07">Branch 07</option>
                    <option value="Branch11">Branch 11</option>
                    <option value="Branch12">Branch 12</option>
                    <option value="Branch13">Branch 13</option>
                    <option value="Branch14">Branch 14</option>
                    <option value="Branch15">Branch 15</option>
                    <option value="Branch16">Branch 16</option>
                    <option value="Branch17">Branch 17</option>
                    <option value="Branch53">Branch 53</option>
                    <option value="Branch54">Branch 54</option>
                    <option value="Branch55">Branch 55</option>
                </select>


                <select class="Zone">
                    <option value="zone00">Select zone</option>	
                    <option value="total">Total</option>	
                    <option value="zone01">zone01</option>
                    <option value="zone02">zone02</option>
                    <option value="zone03">zone03</option>
                    <option value="zone04">zone04</option>
                    <option value="zone05">zone05</option>
                    <option value="zone06">zone06</option>
                    <option value="zone07">zone07</option>
                    <option value="zone08">zone08</option>
                    <option value="zone09">zone09</option>
                    <option value="zone10">zone10</option>
                    <option value="zone11">zone11</option>
                    <option value="zone12">zone12</option>
                    <option value="zone13">zone13</option>
                    <option value="zone14">zone14</option>
                    <option value="zone15">zone15</option>
                    <option value="zone16">zone16</option>
                    <option value="zone17">zone17</option>
                    <option value="zone18">zone18</option>
                </select>


                <select class="DMA">
                    <option value="DMA00">Select DMA</option>	
                    <option value="total">Total</option>	
                    <option value="DMA01">DMA01</option>
                    <option value="DMA02">DMA02</option>
                    <option value="DMA03">DMA03</option>
                    <option value="DMA04">DMA04</option>
                    <option value="DMA05">DMA05</option>
                    <option value="DMA06">DMA06</option>
                    <option value="DMA07">DMA07</option>
                    <option value="DMA08">DMA08</option>
                    <option value="DMA09">DMA09</option>
                    <option value="DMA10">DMA10</option>
                    <option value="DMA11">DMA11</option>
                    <option value="DMA12">DMA12</option>
                    <option value="DMA13">DMA13</option>
                    <option value="DMA14">DMA14</option>
                    <option value="DMA15">DMA15</option>
                </select>
            </form>

        </form>
    <center>
        <div id="chart_div" style="width: 95%; height: 75%; position: relative;"></div>
    </center> 
</body>
</html>
